import React from 'react';
import {Icon, NavBar} from "antd-mobile";
import UserPasswordForm from "./component/user-password-form";
import history from "../../util/router/history";
import {UserPasswordStore} from "./store";
import {inject, observer} from "mobx-react";
import {RouteComponentProps} from "react-router";

interface IUserPasswordProps extends RouteComponentProps<{id: string}>{
  userPasswordStore?: UserPasswordStore | any;
}

@inject('userPasswordStore')
@observer
export default class UserPassword extends React.Component<IUserPasswordProps, any> {

  constructor(props: IUserPasswordProps){
    super(props);
    const { match:{params:{ id }}, userPasswordStore: {initUserInfo}} = this.props;
    initUserInfo(id);
  }

  render() {
    return (
      <div className="my-content-box margin-bottom-10">
        {/* 导航栏 */}
        <NavBar
          mode="dark"
          icon={<Icon type="left" />}
          onLeftClick={history.goBack}
        >
          修改登陆密码
        </NavBar>

        {/* 修改密码Form */}
        <UserPasswordForm />

      </div>
    );
  }

}
